<template>
  <div id='index'>
    <el-container>
      <el-header style="height:80px;padding:0px" >
        <v-header :user="user" v-on:changeBackground="changeBackground"></v-header>
      </el-header>
      <el-container>
        <div>
          <v-menu ref="indexmenu"></v-menu>
        </div>
        <el-main style="margin-left:200px;margin-top:80px;padding-top:0px;padding-left:20px">
          <v-level></v-level>
          <transition :name="transitionName">
            <router-view style="margin-top:45px"></router-view>
            <!--<router-view style="position:absolute;margin-top:40px;margin-left:10px"></router-view>-->
          </transition>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>
<script>
  import header from '@/components/header/header.vue'
  import menu from '@/components/menu/menu.vue'
  import level from '@/components/level/level.vue'
  import { getToken } from '@/utils/auth' // 验权
  import { refresh } from '@/view/api/login.js'
  export default {
    data () {
      return {
        user: this.sessiongetJSON('user'),
        transitionName: 'fold'  // 默认动态路由变化为slide-right
      }
    },
    created () {
    },
    beforeCreate () {
    },
    mounted () {
      if (getToken()) {
        let cThis = this
        let params = {}

        refresh(params,
          function (data) {
            console.log(data)
            cThis.$router.push({path: '/welcome'})
          },
          function (error) {
            console.log(error)
          }
        )
      }
    },
    components: {
      'v-header': header,
      'v-menu': menu,
      'v-level': level
    },
    methods: {
      changeBackground (bgItem) {
        this.$refs.indexmenu.changeBackground(bgItem)
      }
    }
  }
</script>
<style>

  body {
    margin:0px;
    padding:0px
  }
</style>

